<template>
  <view class="bonus">
    <view class="bonus-card">
      <view class="bonus-card__top">
        <image
          class="icon"
          mode="aspectFit"
          :src="`${STATIC_URL2}bonus-icon.png`"
        />
        <view class="title"> {{ type ? "城市" : "平台" }}总收益 </view>
      </view>
      <view class="bonus-card__bottom">
        <view class="left sta">
          <view class="sta-name"> 总营业额 </view>
          <view class="sta-num"> {{ turnover }} </view>
        </view>
        <view class="right sta">
          <view class="sta-name"> 总收益 </view>
          <view class="sta-num"> {{ profit }} </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import { OEMProfit, cityProfit } from "@/utils/api";
export default {
  data() {
    return {
      type: 0,
      turnover: "",
      profit: "",
    };
  },
  onLoad({ type }) {
    this.type = Number(type);
    this.initInfo()
  },
  onReady() {
    var that = this;
    uni.setNavigationBarTitle({
      title: that.type ? "城市股东分红" : "平台创始人分红",
    });
  },
  methods: {
    initInfo() {
      // 城市股东分红
      if (this.type) {
        cityProfit().then((resp) => {
          if (resp.code == 200) {
            this.profit = resp.data.profit;
            this.turnover = resp.data.turnover;
          }
        });
      } else {
        OEMProfit().then((resp) => {
          if (resp.code == 200) {
            this.profit = resp.data.profit;
            this.turnover = resp.data.turnover;
          }
        });
      }
    },
  },
};
</script>

<style lang="scss">
.bonus {
  width: 100%;
  box-sizing: border-box;
  padding: 30rpx 30rpx 0 30rpx;
  color: #ffffff;
  font-size: 36rpx;
  &-card {
    width: 690rpx;
    height: 340rpx;
    background-image: url("https://bc-food.oss-cn-chengdu.aliyuncs.com/bonus.png");
    background-size: cover;
    &__top {
      display: flex;
      align-items: center;
      justify-content: center;
      line-height: 110rpx;
      font-weight: bold;
      .icon {
        width: 47rpx;
        height: 44rpx;
        margin-right: 24rpx;
      }
    }
    &__bottom {
      display: flex;
      align-items: center;
      justify-content: space-around;
      text-align: center;
      margin-top: 50rpx;
      .sta {
        &-name {
          line-height: 95rpx;
        }
      }
    }
  }
}
</style>
